/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */
import React, { Component } from 'react';
import {
    AppRegistry,
    View
} from 'react-native';

import App from './js/home/chest';
export default class setup extends Component {
    render() {
        return (
            <App/>
        );
    }
}
AppRegistry.registerComponent('lulu', () => setup);

import React,{Component} from 'react';
import {
    AppRegistry,
    Image,
    findNodeHandle,
    StyleSheet,
    Text,
    View
} from 'react-native';

import {BlurView} from 'react-native-blur';

class Basic extends Component {
    constructor() {
        super()
        this.state = {
            viewRef: 0,
        }
    }

    imageLoaded() {
        this.setState({viewRef: findNodeHandle(this.refs.backgroundImage)})
    }

    render() {
        return (
            <Image
                source={require('./image/sj201402411009_170x264.jpg')}
                style={styles.container}
                ref={'backgroundImage'}
                onLoadEnd={this.imageLoaded.bind(this)}>
                <Text style={{fontSize:90}}>
                    刘三姐
                </Text>
                <BlurView
                    blurRadius={10}
                    blurAmount={100}
                    downsampleFactor={10}
                    overlayColor={'rgba(0, 0, 0, .25)'}
                    style={styles.blurView}
                    viewRef={this.state.viewRef}/>
                <Text style={styles.welcome}>{`Blur component`}</Text>
            </Image>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        backgroundColor: 'transparent',
        resizeMode: 'cover',
        width: null,
        height: null,
    },
    welcome: {
        fontSize: 22,
        fontWeight: 'bold',
        textAlign: 'center',
        margin: 10,
        color: '#FFFFFF',
    },
    blurView: {
        position: "absolute",
        left: 0,
        top: 0,
        bottom: 0,
        right: 0
    },
});
AppRegistry.registerComponent('lulu', () => Basic);
